<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{
            padding: 0;
            margin: 0;
            list-style: none;
        }
        a{
            text-decoration: none;
        }
        .newlist{
            width: 230px;
            border: 1px solid #999;
        }
    .newlist h2{
        font-weight: 400;
        text-indent: 10px;
        font-size: 18px;
        line-height: 50px;
        height: 50px;
        /* height: 230px; */
        /* 线性渐变  从上到下渐变 由紫色渐变到白色*/
        /* background: linear-gradient(purple,#fff); */
        /* to  top 改变了渐变的方向  也可以从左到右，或者从右到左*/
        /* background: linear-gradient(to top,purple,#fff); */
        /* 也可以从一个角到另外一个角  写法类似 to top left */
        /* background: linear-gradient(to top left,purple,#fff); */
        /* 改变背景颜色的占比 */
        background: linear-gradient(purple,20%,#fff);
        /* 没有渐变的效果，各占50% */
        /* background: linear-gradient(purple 50%,#f00 50%); */

        /* 径向渐变 从中间开始向外渐变*/
        /* background: radial-gradient(purple,#fff); */
        /* background: radial-gradient(purple,#fff,yellow); */
        /* background: radial-gradient(purple 50%,#f00 50%); */
    }

    /* 渐变色 分为线性渐变和径向渐变 */
    </style>
</head>
<body>
    <div class="newlist">
        <h2>
            京东快报
        </h2>
    </div>
</body>
</html>